﻿<template>
	<div class="device-container">
		<el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
			<el-form :model="queryParams" ref="queryForm" labelWidth="90">
				<el-row>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
						<el-form-item label="关键字">
							<el-input v-model="queryParams.searchKey" clearable="" placeholder="请输入模糊查询关键字" />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="名称">
							<el-input v-model="queryParams.name" clearable="" placeholder="请输入名称" />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="客户端设备号">
							<el-input v-model="queryParams.clientSn" clearable="" placeholder="请输入客户端设备号" />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="通行方向">
							<el-select clearable="" v-model="queryParams.direction" placeholder="请选择通行方向">
								<el-option v-for="(item, index) in dl('DirectionType')" :key="index" :value="item.value" :label="`${item.name} (${item.code}) [${item.value}] `" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="项目ID">
							<el-select clearable="" filterable="" v-model="queryParams.projectId" placeholder="请选择项目ID">
								<el-option v-for="(item, index) in projectProjectIdDropdownList" :key="index" :value="item.value" :label="item.label" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="通信方式">
							<el-select clearable="" v-model="queryParams.deviceConnect" placeholder="请选择通信方式">
								<el-option v-for="(item, index) in dl('ConnectType')" :key="index" :value="item.value" :label="`${item.name} (${item.code}) [${item.value}] `" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="设备型号">
							<el-select clearable="" v-model="queryParams.deviceModel" placeholder="请选择设备型号">
								<el-option v-for="(item, index) in dl('ModelType')" :key="index" :value="item.value" :label="`${item.name} (${item.code}) [${item.value}] `" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
						<el-form-item label="状态">
							<el-select clearable="" v-model="queryParams.status" placeholder="请选择状态">
								<el-option v-for="(item, index) in dl('StatusEnum')" :key="index" :value="item.value" :label="`${item.name} (${item.code}) [${item.value}] `" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> </el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
						<el-form-item>
							<el-button-group style="display: flex; align-items: center">
								<el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'device:page'"> 查询 </el-button>
								<el-button icon="ele-Refresh" @click="() => (queryParams = {})"> 重置 </el-button>
								<el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI" style="margin-left: 5px"> 高级查询 </el-button>
								<el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI" style="margin-left: 5px"> 隐藏 </el-button>
								<el-button type="primary" style="margin-left: 5px" icon="ele-Plus" @click="openAddDevice" v-auth="'device:add'"> 新增 </el-button>
							</el-button-group>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</el-card>
		<el-card class="full-table" shadow="hover" style="margin-top: 5px">
			<el-table :data="tableData" style="width: 100%" v-loading="loading" tooltip-effect="light" row-key="id" @sort-change="sortChange" border="">
				<el-table-column type="index" label="序号" width="55" align="center" />
				<!-- <el-table-column prop="name" label="名称" show-overflow-tooltip="" /> -->
				<el-table-column prop="name" label="设备名称" show-overflow-tooltip="">
					<template #default="scope">
						<div style="font-weight: bold; display: flex; align-content: center; align-items: center">
							<el-icon size="16" style="margin-right: 6px"><ele-Tools /></el-icon>{{ scope.row.clientSn }}
							<el-tag :type="scope.row.direction == 1 ? 'success' : 'danger'" style="margin-left: 20px"> {{ dv('DirectionType', scope.row.direction)?.name }}</el-tag>
						</div>
						<div style="">
							名称: {{ scope.row.name }}&nbsp;&nbsp;&nbsp;&nbsp;通信方式:<el-tag :type="dv('ConnectType', scope.row.deviceConnect)?.tagType">
								{{ dv('ConnectType', scope.row.deviceConnect)?.name }}</el-tag
							>
						</div>
						<div></div>
						<div style="">所属项目: {{ scope.row.projectIdName }}</div>
					</template>
				</el-table-column>
				<!-- <el-table-column prop="clientSn" label="客户端设备号" show-overflow-tooltip="" /> -->
				<!-- <el-table-column prop="direction" label="通行方向" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag :type="dv('DirectionType', scope.row.direction)?.tagType"> {{ dv('DirectionType', scope.row.direction)?.name }}</el-tag>
					</template>
				</el-table-column> -->
				<!-- <el-table-column prop="projectId" label="项目ID" show-overflow-tooltip="">
					<template #default="scope">
						<span>{{ scope.row.projectIdName }}</span>
					</template>
				</el-table-column> -->
				<!-- <el-table-column prop="deviceConnect" label="通信方式" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag :type="dv('ConnectType', scope.row.deviceConnect)?.tagType"> {{ dv('ConnectType', scope.row.deviceConnect)?.name }}</el-tag>
					</template>
				</el-table-column> -->
				<el-table-column prop="deviceModel" label="设备型号" show-overflow-tooltip="" align="center" width="120">
					<template #default="scope">
						<el-tag :type="dv('ModelType', scope.row.deviceModel)?.tagType"> {{ dv('ModelType', scope.row.deviceModel)?.name }}</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="enableEmpSend" label="人员" show-overflow-tooltip="" width="200">
					<template #default="scope">
						<div>是否允许下发人员到设备&nbsp;&nbsp;<el-tag v-if="scope.row.enableEmpSend" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
						<div>是否拉取人员信息&nbsp;&nbsp;<el-tag v-if="scope.row.enableGetEmpInfo" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
					</template>
				</el-table-column>
				<el-table-column prop="enableRecLog" label="通行记录" show-overflow-tooltip="" width="200">
					<template #default="scope">
						<div>是否接收通行记录&nbsp;&nbsp;<el-tag v-if="scope.row.enableRecLog" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
						<div>是否上传通行记录&nbsp;&nbsp;<el-tag v-if="scope.row.enableUploadLog" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
						<div>是否抓拍采集&nbsp;&nbsp;<el-tag v-if="scope.row.enableRecNotMatchUploadLog" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
					</template>
				</el-table-column>
				<!-- <el-table-column prop="enableUploadLog" label="是否上传通行记录" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag v-if="scope.row.enableUploadLog"> 是 </el-tag>
						<el-tag type="danger" v-else> 否 </el-tag>
					</template>
				</el-table-column> -->
				<!-- <el-table-column prop="enableRecNotMatchUploadLog" label="是否保存不匹配通行记录" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag v-if="scope.row.enableRecNotMatchUploadLog"> 是 </el-tag>
						<el-tag type="danger" v-else> 否 </el-tag>
					</template>
				</el-table-column> -->
				<el-table-column prop="isOnline" label="在线监测" show-overflow-tooltip="" align="center" width="140">
					<template #default="scope">
						<div>客户端在线:&nbsp;&nbsp;<el-tag v-if="scope.row.isOnline" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
						<div>服务端在线:&nbsp;&nbsp;<el-tag v-if="scope.row.isOnlineServer" type="success"> 是 </el-tag> <el-tag type="danger" v-else> 否 </el-tag></div>
					</template>
				</el-table-column>
				<!-- <el-table-column prop="isOnlineServer" label="服务端在线" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag v-if="scope.row.isOnlineServer"> 是 </el-tag>
						<el-tag type="danger" v-else> 否 </el-tag>
					</template>
				</el-table-column> -->
				<!-- <el-table-column prop="enableGetEmpInfo" label="是否拉取人员信息" show-overflow-tooltip="">
					<template #default="scope">
						<el-tag v-if="scope.row.enableGetEmpInfo"> 是 </el-tag>
						<el-tag type="danger" v-else> 否 </el-tag>
					</template>
				</el-table-column> -->
				<el-table-column prop="status" label="状态" show-overflow-tooltip="" align="center" width="60">
					<template #default="scope">
						<el-tag :type="scope.row.status == 1 ? 'success' : 'danger'"> {{ dv('StatusEnum', scope.row.status)?.name }}</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="status" label="设备命令" show-overflow-tooltip="" align="center" width="240">
					<template #default="scope">
						<div>
							<el-button style="width: 64px" type="primary" @click="Restart(scope.row.clientSn)">重启设备</el-button>
							<el-button style="width: 64px" type="primary" @click="Getversion(scope.row.clientSn)">获取版本</el-button>
							<el-button style="width: 64px" type="primary" @click="GetAllpersonid(scope.row.clientSn)">设备人员</el-button>
						</div>
						<div style="margin-top: 2px">
							<el-button style="width: 64px" type="primary" @click="Snapshot(scope.row.clientSn)">设备截图</el-button>
							<el-button style="width: 64px" type="primary" @click="DeletePerson(scope.row.clientSn)">删除人员</el-button>
							<el-button style="width: 64px" type="primary" @click="DeleteAllPerson(scope.row.clientSn)">清空人员</el-button>
						</div>
						<div style="margin-top: 2px">
							<el-button style="width: 64px" type="primary" @click="RequestAppParams(scope.row.clientSn)">应用参数</el-button>
							<el-button style="width: 64px" type="primary" @click="UpdateAppParams(scope.row)">参数设置</el-button>
							<el-button style="width: 64px" type="primary"></el-button>
						</div>
						<!-- <el-tag :type="scope.row.status == 1 ? 'success' : 'danger'"> {{ dv('StatusEnum', scope.row.status)?.name }}</el-tag> -->
					</template>
				</el-table-column>
				<el-table-column label="记录操作" width="140" align="center" fixed="right" show-overflow-tooltip="" v-if="auth('device:update') || auth('device:delete')">
					<template #default="scope">
						<el-button icon="ele-Edit" size="small" text="" type="primary" @click="openEditDevice(scope.row)" v-auth="'device:update'"> 编辑 </el-button>
						<el-button icon="ele-Delete" size="small" text="" type="primary" @click="delDevice(scope.row)" v-auth="'device:delete'"> 删除 </el-button>
					</template>
				</el-table-column>
			</el-table>
			<el-pagination
				v-model:currentPage="tableParams.page"
				v-model:page-size="tableParams.pageSize"
				:total="tableParams.total"
				:page-sizes="[10, 20, 50, 100, 200, 500]"
				size="small"
				background=""
				@size-change="handleSizeChange"
				@current-change="handleCurrentChange"
				layout="total, sizes, prev, pager, next, jumper"
			/>
			<printDialog ref="printDialogRef" :title="printDeviceTitle" @reloadTable="handleQuery" />
			<editDialog ref="editDialogRef" :title="editDeviceTitle" @reloadTable="handleQuery" />
			<UpdateAppParam ref="UpdateAppParamsRef" title="设备参数设置" @reloadTable="handleQuery"></UpdateAppParam>
		</el-card>
		<el-dialog v-model="dialogVisible" title="截图" width="500" draggable>
			<!-- <span>It's a draggable Dialog</span> -->
			<div>
				<el-image
					style="height: 600px"
					:src="'data:image/jpeg;base64,' + SnapshotPic"
					:zoom-rate="1.2"
					:max-scale="7"
					:min-scale="0.2"
					:preview-src-list="['data:image/jpeg;base64,' + SnapshotPic]"
					:initial-index="0"
					:preview-teleported="true"
					fit="cover"
				/>
			</div>
			<template #footer>
				<div class="dialog-footer">
					<!-- <el-button @click="dialogVisible = false">Cancel</el-button> -->
					<el-button type="primary" @click="dialogVisible = false"> 返回 </el-button>
				</div>
			</template>
		</el-dialog>
	</div>
</template>

<script lang="ts" setup="" name="device">
import { ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import { auth } from '/@/utils/authFunction';
import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
import { getDictLabelByVal as dv } from '/@/utils/dict-utils';
import { formatDate } from '/@/utils/formatTime';
import printDialog from '/@/views/system/print/component/hiprint/preview.vue';
import editDialog from '/@/views/main/device/component/editDialog.vue';
import { pageDevice, deleteDevice } from '/@/api/main/device';
import { getProjectProjectIdDropdown } from '/@/api/main/device';
import { getAPI } from '/@/utils/axios-utils';
import { SysEnumApi } from '/@/api-services/api';
import commonFunction from '/@/utils/commonFunction';
import request from '/@/utils/request';
import type { Action } from 'element-plus';
import { id } from 'element-plus/es/locale';
import UpdateAppParam from '/@/views/main/device/component/UpdateAppParams.vue';

const UpdateAppParamsRef = ref();
const dialogVisible = ref(false);
const showAdvanceQueryUI = ref(false);
const printDialogRef = ref();
const editDialogRef = ref();
const loading = ref(false);
const tableData = ref<any>([]);
const queryParams = ref<any>({});
const tableParams = ref({
	page: 1,
	pageSize: 10,
	field: 'createTime', // 默认的排序字段
	order: 'descending', // 排序方向
	descstr: 'descending', // 降序排序的关键字符
	total: 0 as any,
});

const printDeviceTitle = ref('');
const editDeviceTitle = ref('');
const SnapshotPic = ref('');

//Restart
const Restart = async (DeviceSn: any) => {
	loading.value = true;
	var res = await request({
		url: '/api/device/cmd_Restart',
		method: 'post',
		data: DeviceSn,
	});
	// 'success' | 'info' | 'warning' | 'error'
	if (res.data.code == 200 && res.data.result.code == 0) {
		ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '设备重启', {
			confirmButtonText: '已知晓',
			type: 'success',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	} else {
		ElMessageBox.alert(res.data.message + res.data.result.msg, '设备重启-失败', {
			confirmButtonText: '已知晓',
			type: 'error',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	}
	console.log(res);
};

//cmd_Getversion  获取设备版本信息
const Getversion = async (DeviceSn: any) => {
	loading.value = true;
	var res = await request({
		url: '/api/device/cmd_Getversion',
		method: 'post',
		data: DeviceSn,
	});
	// 'success' | 'info' | 'warning' | 'error'
	if (res.data.code == 200 && res.data.result.code == 0) {
		ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '获取设备版本信息', {
			confirmButtonText: '已知晓',
			type: 'success',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	} else {
		ElMessageBox.alert(res.data.message + res.data.result.msg, '获取设备版本信息-失败', {
			confirmButtonText: '已知晓',
			type: 'error',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	}
	console.log(res);
};

const GetAllpersonid = async (DeviceSn: any) => {
	loading.value = true;
	var res = await request({
		url: '/api/device/cmd_GetAllpersonid',
		method: 'post',
		data: DeviceSn,
	});

	// 'success' | 'info' | 'warning' | 'error'
	if (res.data.code == 200 && res.data.result.code == 0) {
		var ids = JSON.parse(res.data.result.result);
		var idscount = ids.ids.split(',');
		//console.log(idscount);

		ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:设备总人数(' + idscount.length + ')人,' + res.data.result.result, '获取所有人员ID', {
			confirmButtonText: '已知晓',
			type: 'success',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	} else {
		ElMessageBox.alert(res.data.message + res.data.result.msg, '获取所有人员ID-失败', {
			confirmButtonText: '已知晓',
			type: 'error',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	}
	console.log(res);
};

const Snapshot = async (DeviceSn: any) => {
	loading.value = true;
	var res = await request({
		url: '/api/device/cmd_Snapshot',
		method: 'post',
		data: DeviceSn,
	});

	// 'success' | 'info' | 'warning' | 'error'
	if (res.data.code == 200 && res.data.result.code == 0) {
		var result = JSON.parse(res.data.result.result);
		//var idscount = ids.ids.split(',');
		//console.log(result.image.image_data);
		SnapshotPic.value = result.image.image_data;
		dialogVisible.value = true;
		loading.value = false;

		// ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '设备截图', {
		// 	confirmButtonText: '已知晓',
		// 	type: 'success',
		// 	callback: (action: Action) => {
		// 		loading.value = false;
		// 	},
		// });
	} else {
		ElMessageBox.alert(res.data.message + res.data.result.msg, '设备截图-失败', {
			confirmButtonText: '已知晓',
			type: 'error',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	}
	//console.log(res);
};

const DeletePerson = async (DeviceSn: any) => {
	ElMessageBox.prompt('请输入人员的住建ID', '按ID删除人员', {
		confirmButtonText: '确认',
		cancelButtonText: '取消',
		// inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
		// inputErrorMessage: 'Invalid Email',
	})
		.then(async ({ value }) => {
			if (value != null && value != '') {
				loading.value = true;
				var res = await request({
					url: '/api/device/cmd_DeletePerson',
					method: 'post',
					data: { DeviceSn: DeviceSn, Id: value },
				});

				// 'success' | 'info' | 'warning' | 'error'
				if (res.data.code == 200 && res.data.result.code == 0) {
					ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '按ID删除人员', {
						confirmButtonText: '已知晓',
						type: 'success',
						callback: (action: Action) => {
							loading.value = false;
						},
					});
				} else {
					ElMessageBox.alert(res.data.message + res.data.result.msg, '按ID删除人员-失败', {
						confirmButtonText: '已知晓',
						type: 'error',
						callback: (action: Action) => {
							loading.value = false;
						},
					});
				}
			}
		})
		.catch(() => {
			// ElMessage({
			// 	type: 'info',
			// 	message: 'Input canceled',
			// });
		});
	//console.log(res);
};

const DeleteAllPerson = async (DeviceSn: any) => {
	ElMessageBox.confirm(`确定要删除所有人员吗?`, '提示', {
		confirmButtonText: '确定',
		cancelButtonText: '取消',
		type: 'warning',
	})
		.then(async () => {
			loading.value = true;
			var res = await request({
				url: '/api/device/cmd_DeleteAllPerson',
				method: 'post',
				data: DeviceSn,
			});

			// 'success' | 'info' | 'warning' | 'error'
			if (res.data.code == 200 && res.data.result.code == 0) {
				ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '删除所有人员', {
					confirmButtonText: '已知晓',
					type: 'success',
					callback: (action: Action) => {
						loading.value = false;
					},
				});
			} else {
				ElMessageBox.alert(res.data.message + res.data.result.msg, '删除所有人员-失败', {
					confirmButtonText: '已知晓',
					type: 'error',
					callback: (action: Action) => {
						loading.value = false;
					},
				});
			}
		})
		.catch(() => {});
};

const RequestAppParams = async (DeviceSn: any) => {
	loading.value = true;
	var res = await request({
		url: '/api/device/cmd_RequestAppParams',
		method: 'post',
		data: DeviceSn,
	});

	// 'success' | 'info' | 'warning' | 'error'
	if (res.data.code == 200 && res.data.result.code == 0) {
		ElMessageBox.alert(res.data.message + res.data.result.msg + '结果为:' + res.data.result.result, '获取应用参数', {
			confirmButtonText: '已知晓',
			type: 'success',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	} else {
		ElMessageBox.alert(res.data.message + res.data.result.msg, '获取应用参数-失败', {
			confirmButtonText: '已知晓',
			type: 'error',
			callback: (action: Action) => {
				loading.value = false;
			},
		});
	}
};

const UpdateAppParams = async (row: any) => {
	UpdateAppParamsRef.value.openDialog(row);
};

// 改变高级查询的控件显示状态
const changeAdvanceQueryUI = () => {
	showAdvanceQueryUI.value = !showAdvanceQueryUI.value;
};

// 查询操作
const handleQuery = async () => {
	loading.value = true;
	var res = await pageDevice(Object.assign(queryParams.value, tableParams.value));
	tableData.value = res.data.result?.items ?? [];
	tableParams.value.total = res.data.result?.total;
	loading.value = false;
};

// 列排序
const sortChange = async (column: any) => {
	tableParams.value.field = column.prop;
	tableParams.value.order = column.order;
	await handleQuery();
};

// 打开新增页面
const openAddDevice = () => {
	editDeviceTitle.value = '添加人脸设备';
	editDialogRef.value.openDialog({});
};

// 打开打印页面
const openPrintDevice = async (row: any) => {
	printDeviceTitle.value = '打印人脸设备';
};

// 打开编辑页面
const openEditDevice = (row: any) => {
	editDeviceTitle.value = '编辑人脸设备';
	editDialogRef.value.openDialog(row);
};

// 删除
const delDevice = (row: any) => {
	ElMessageBox.confirm(`确定要删除吗?`, '提示', {
		confirmButtonText: '确定',
		cancelButtonText: '取消',
		type: 'warning',
	})
		.then(async () => {
			await deleteDevice(row);
			handleQuery();
			ElMessage.success('删除成功');
		})
		.catch(() => {});
};

// 改变页面容量
const handleSizeChange = (val: number) => {
	tableParams.value.pageSize = val;
	handleQuery();
};

// 改变页码序号
const handleCurrentChange = (val: number) => {
	tableParams.value.page = val;
	handleQuery();
};

const projectProjectIdDropdownList = ref<any>([]);
const getProjectProjectIdDropdownList = async () => {
	let list = await getProjectProjectIdDropdown();
	projectProjectIdDropdownList.value = list.data.result ?? [];
};
getProjectProjectIdDropdownList();

handleQuery();
</script>
<style scoped>
:deep(.el-input),
:deep(.el-select),
:deep(.el-input-number) {
	width: 100%;
}
</style>
